{% extends 'libraries/index.html' %}

{% block content %}

<script type="text/javascript">
	var input_objects=document.getElementsByName('pk'), checked_numbers=0, user_owned_numbers=0, user_borrowed_numbers;		
	function base_fct()
	{
		{% for book in books %}
		{% if book.owner == request.user %}
		user_owned_numbers += 1;
		{% endif %}
		{% endfor %}
		for (var i = 0; i < input_objects.length; i++) {
			if (input_objects[i].checked == true){
				checked_numbers += 1;
			}
		}
	}
	function book_borrowed()
	{
		user_borrowed_numbers = user_owned_numbers + checked_numbers;
		if (checked_numbers != 0 ) {
			if (user_borrowed_numbers <= 3) {
				document.getElementById('form_submit').submit();
				alert("借阅成功！");
			} else {
				alert("您最多只能借阅三本！");
			}
		}
	}
	function submit_tested()
	{
		base_fct();
		if (checked_numbers == 0 ) {
			alert("您未选择任何书籍！");
		} else {
			var r=confirm("确认是否借阅!");
			if (r == true){
				book_borrowed();
			}
		}
		
	}
</script>

<form action="{% url 'libraries:borrows' %}" method="post" id="form_submit">
{% csrf_token %}
{% if x != 0 %}
<input type="button" value="确定" id="submit_button" onclick="submit_tested()">
<table align="center" border="1">
	<tr>
		<td>
			
		</td>
		<td>
			序号
		</td>
		<td align="center">
			类型
		</td>
		<td align="center">
			名称
		</td>
	</tr>
{% else %}
<p>书籍已经被借完！</p>
{% endif %}
	{% for book in books %}
	<tr>
 	{% if book.state == 0 %}
 		<td align="center">
 			<input type="checkbox" name="pk" value="{{ book.id }}">
 		</td>
 		<td align="center">
 	 		{{ book.numbers }}
 		</td>
 		<td width="100" align="center">
 	 		{{ book.book_type }}
 		</td>
 		<td width="200" align="center">
 			{{ book.name }}
 		</td>
 	{% endif %}
 	</tr>
	{% endfor %}
</table>
</form>

<style type="text/css">
	table
	{
		background-color: #66ccff;
	}
	th
	{
		background-color: ;
		color:white;
	}
</style>

{% endblock content %}